<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <button>赋诗</button>


<script>

    var btn = document.getElementsByTagName("button")[0];

    //第一种事件绑定的方法容易被层叠。
//    btn.onclick = function () {
//        console.log("九尺龙泉万卷书，上天生我意何如。");
//    }
//
//    btn.onclick = function () {
//        console.log("不能报国平天下，枉为男儿大丈夫。");
//    }


    //addEventListener: 事件监听器。 原事件被执行的时候，后面绑定的事件照样被执行
    //第二种事件绑定的方法不会出现层叠。（更适合团队开发）
    btn.addEventListener("click",fn1);
    btn.addEventListener("click",fn2);
    function fn1(){
        console.log("九尺龙泉万卷书，上天生我意何如。");
    }
    function fn2(){
        console.log("不能报国平天下，枉为男儿大丈夫。");
    }

    //调用这是事件源，参数1事件名(不带on) ，参数2事件名(执行函数)           参数3事件名(捕获或者冒泡)


</script>
</body>
</html>